<div class="modal" ng-controller="FlowableAssignmentPopupCtrl">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;
                </button>
                <h2 translate>PROPERTY.ASSIGNMENT.TITLE</h2>
            </div>
            <div class="modal-body">
                <div class="detail-group clearfix">

                    <div class="form-group clearfix">
                        <div class="col-xs-12">
                            <!-- 类型 -->
                            <label class="col-xs-4">{{'PROPERTY.ASSIGNMENT.TYPE' | translate}}</label>
                            <!-- “身份存储，固定值”按钮  -->
                            <div class="col-xs-8">
                                <div class="btn-group btn-group-justified">
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-default"
                                                ng-click="popup.assignmentObject.type = 'idm'"
                                                ng-model="popup.assignmentObject.type"
                                                ng-class="{'active' : popup.assignmentObject.type == 'idm'}">
                                            {{'PROPERTY.ASSIGNMENT.TYPE.IDENTITYSTORE' | translate}}
                                        </button>
                                    </div>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-default"
                                                ng-click="popup.assignmentObject.type = 'static'"
                                                ng-model="popup.assignmentObject.type"
                                                ng-class="{'active' : popup.assignmentObject.type != 'idm'}">
                                            {{'PROPERTY.ASSIGNMENT.TYPE.STATIC' | translate}}
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group clearfix" ng-show="popup.assignmentObject.type != 'idm'">
                        <div class="col-xs-12">
                            <label>{{'PROPERTY.ASSIGNMENT.ASSIGNEE' | translate}}</label>
                        </div>
                        <div class="col-xs-12">

                            <input type="text" id="assigneeField" class="form-control"
                                   ng-model="popup.assignmentObject.static.assignee"
                                   placeholder="{{'PROPERTY.ASSIGNMENT.ASSIGNEE_PLACEHOLDER' | translate}}"/>
                        </div>
                    </div>

                    <div class="form-group clearfix" ng-show="popup.assignmentObject.type != 'idm'">
                        <div class="col-xs-12">
                            <label>{{'PROPERTY.ASSIGNMENT.CANDIDATE_USERS' | translate}}</label>
                        </div>
                        <div class="col-xs-12"
                             ng-repeat="candidateUser in popup.assignmentObject.static.candidateUsers">
                            <input id="userField" class="form-control" type="text" ng-model="candidateUser.value"/>
                            <i ng-if="popup.assignmentObject.static.candidateUsers.length >1"
                               class="glyphicon glyphicon-minus clickable-property"
                               ng-click="removeCandidateUserValue($index)"></i>
                            <i ng-if="$index == (popup.assignmentObject.static.candidateUsers.length - 1)"
                               class="glyphicon glyphicon-plus clickable-property"
                               ng-click="addCandidateUserValue($index)"></i>
                        </div>
                    </div>

                    <div class="form-group clearfix" ng-show="popup.assignmentObject.type != 'idm'">
                        <div class="col-xs-12">
                            <label>{{'PROPERTY.ASSIGNMENT.CANDIDATE_GROUPS' | translate}}</label>
                        </div>
                        <div class="col-xs-12"
                             ng-repeat="candidateGroup in popup.assignmentObject.static.candidateGroups">
                            <input id="groupField" class="form-control" type="text" ng-model="candidateGroup.value"/>
                            <i ng-if="popup.assignmentObject.static.candidateGroups.length >1"
                               class="glyphicon glyphicon-minus clickable-property"
                               ng-click="removeCandidateGroupValue($index)"></i>
                            <i ng-if="$index == (popup.assignmentObject.static.candidateGroups.length - 1)"
                               class="glyphicon glyphicon-plus clickable-property"
                               ng-click="addCandidateGroupValue($index)"></i>
                        </div>
                    </div>

                    <!-- 分配下拉选择器 -->
                    <div class="form-group clearfix" ng-show="popup.assignmentObject.type == 'idm'">
                        <div class="col-xs-12">
                            <!-- 分配 -->
                            <div class="col-xs-4">
                                <label>{{'PROPERTY.ASSIGNMENT.IDM.TYPE' | translate}}</label>
                            </div>
                            <div class="col-xs-8">
                                <div class="btn-group span">
                                    <button class="selection"
                                            ng-options="option as (option.title | translate) for option in assignmentOptions"
                                            bs-select ng-model="assignmentOption" activiti-fix-dropdown-bug>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- 候选用户 -->
                    <div class="form-group clearfix"
                         ng-show="popup.assignmentObject.type == 'idm' && assignmentOption.id == 'users'">
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label>{{'PROPERTY.ASSIGNMENT.CANDIDATE_USERS' | translate}}</label>
                            </div>
                            <div class="col-xs-8 clearfix">
                                <ul class="simple-list"
                                    ng-show="popup.assignmentObject.idm.candidateUsers.length || popup.assignmentObject.idm.candidateUserFields.length">
                                    <li ng-repeat="user in popup.assignmentObject.idm.candidateUsers">
                                        <i class="icon icon-user"></i>
                                        <span user-name="user"></span>

                                        <div class="actions">
                                            <a ng-click="removeCandidateUser(user)"><i class="icon icon-remove"></i></a>
                                        </div>
                                    </li>
                                    <li ng-repeat="userField in popup.assignmentObject.idm.candidateUserFields">
                                        <i class="icon icon-user"></i>
                                        <span>{{userField.name}}</span>
                                        <span class="field-type"> - {{userFieldField.id}}</span>

                                        <div class="actions">
                                            <a ng-click="removeCandidateUserField(userField)"><i
                                                    class="icon icon-remove"></i></a>
                                        </div>
                                    </li>
                                </ul>
                                <div class="no-results"
                                     ng-if="(!popup.assignmentObject.idm.candidateUsers || !popup.assignmentObject.idm.candidateUsers.length) && (!popup.assignmentObject.idm.candidateUserFields || !popup.assignmentObject.idm.candidateUserFields.length)">
                                    {{'PROPERTY.ASSIGNMENT.IDM.NO_CANDIDATE_USERS' | translate}}
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group clearfix"
                         ng-show="popup.assignmentObject.type == 'idm' && assignmentOption.id == 'groups'">
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label>{{'PROPERTY.ASSIGNMENT.CANDIDATE_GROUPS' | translate}}</label>
                            </div>
                            <div class="col-xs-8 clearfix">
                                <ul class="simple-list"
                                    ng-show="popup.assignmentObject.idm.candidateGroups.length || popup.assignmentObject.idm.candidateGroupFields.length">
                                    <li ng-repeat="group in popup.assignmentObject.idm.candidateGroups">
                                        {{group.name}}
                                        <div class="actions">
                                            <a ng-click="removeCandidateGroup(group)"><i
                                                    class="icon icon-remove"></i></a>
                                        </div>
                                    </li>
                                    <li ng-repeat="groupField in popup.assignmentObject.idm.candidateGroupFields">
                                        {{groupField.name}}
                                        <div class="actions">
                                            <a ng-click="removeCandidateGroupField(groupField)"><i
                                                    class="icon icon-remove"></i></a>
                                        </div>
                                    </li>
                                </ul>
                                <div class="no-results"
                                     ng-if="(!popup.assignmentObject.idm.candidateGroups || !popup.assignmentObject.idm.candidateGroups.length) && (!popup.assignmentObject.idm.candidateGroupFields || !popup.assignmentObject.idm.candidateGroupFields.length)">
                                    {{'PROPERTY.ASSIGNMENT.IDM.NO_CANDIDATE_GROUPS' | translate}}
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group clearfix"
                         ng-show="popup.assignmentObject.type == 'idm' && assignmentOption.id == 'user'">
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label>{{'PROPERTY.ASSIGNMENT.ASSIGNEE' | translate}}</label>
                            </div>
                            <div class="col-xs-8">
                                <label ng-if="!popup.assignmentObject.idm.assignee && !popup.assignmentObject.idm.assigneeField">{{'PROPERTY.ASSIGNMENT.NONE' | translate}}</label>
                                <ul class="simple-list"
                                    ng-if="popup.assignmentObject.idm.assignee || popup.assignmentObject.idm.assigneeField">
                                    <li>
                                        <i class="icon icon-user"></i>
                                        <span ng-if="popup.assignmentObject.idm.assignee"
                                              user-name="popup.assignmentObject.idm.assignee"></span>
                                        <span ng-if="popup.assignmentObject.idm.assigneeField">{{popup.assignmentObject.idm.assigneeField.name}}</span>
                                        <span ng-if="popup.assignmentObject.idm.assigneeField"
                                              class="field-type"> - {{popup.assignmentObject.idm.assigneeField.id}}</span>

                                        <div class="actions"
                                             ng-if="popup.assignmentObject.idm.assignee || popup.assignmentObject.idm.assigneeField">
                                            <a ng-click="removeAssignee()"><i class="icon icon-remove"></i></a>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>

                    <div class="form-group clearfix"
                         ng-if="popup.assignmentObject.type == 'idm' && (!popup.assignmentObject.assignmentSourceType || popup.assignmentObject.assignmentSourceType == 'search') && (assignmentOption.id == 'user' || assignmentOption.id == 'users')">
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label>{{'PROPERTY.ASSIGNMENT.SEARCH' | translate}}</label>
                            </div>
                            <div class="col-xs-8">
                                <input class="form-control" type="text" id="people-select-input"
                                       placeholder="{{'PROPERTY.ASSIGNMENT.PLACEHOLDER-SEARCHUSER' | translate}}"
                                       auto-focus custom-keys
                                       up-pressed="previousUser()" down-pressed="nextUser()"
                                       enter-pressed="confirmUser()" delayed-model="popup.filter" delay="200"/>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label></label>
                            </div>
                            <div class="col-xs-8">
                                <div class="subtle" style="margin: 2px 0 2px 0">
                                    <span translate="PROPERTY.ASSIGNMENT.MATCHING"></span>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label></label>
                            </div>
                            <div class="col-xs-8">
                                <div class="inline-people-select">
                                    <ul class="simple-list">
                                        <li ng-click="confirmUser(user)" ng-repeat="user in popup.userResults"
                                            ng-class="{'active': $index == popup.selectedIndex}">
                                            <div user-picture="user" user-index="$index" user-name="user"></div>
                                        </li>
                                    </ul>
                                    <div class="nothing-to-see" translate="GENERAL.MESSAGE.PEOPLE-NO-MATCHING-RESULTS"
                                         ng-show="popup.userResults.length == 0"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group clearfix"
                         ng-if="popup.assignmentObject.type == 'idm' && (!popup.assignmentObject.assignmentSourceType || popup.assignmentObject.assignmentSourceType == 'search') && assignmentOption.id == 'groups'">
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label>{{'PROPERTY.ASSIGNMENT.SEARCH' | translate}}</label>
                            </div>
                            <div class="col-xs-8">
                                <input class="form-control" type="text" id="people-select-input"
                                       placeholder="{{'PROPERTY.ASSIGNMENT.PLACEHOLDER-SEARCHGROUP' | translate}}"
                                       auto-focus custom-keys
                                       up-pressed="previousGroup()" down-pressed="nextGroup()"
                                       enter-pressed="confirmGroup()" delayed-model="popup.groupFilter"
                                       delay="200"/>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label></label>
                            </div>
                            <div class="col-xs-8">
                                <div class="subtle">
                                    <span translate="PROPERTY.ASSIGNMENT.MATCHING"></span>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="col-xs-4">
                                <label></label>
                            </div>
                            <div class="col-xs-8">
                                <div class="inline-people-select">
                                    <ul class="simple-list">
                                        <li ng-click="confirmGroup(group);" ng-repeat="group in popup.groupResults"
                                            ng-class="{'active': $index == popup.selectedGroupIndex}">
                                            {{group.name}}
                                        </li>
                                    </ul>
                                    <div class="nothing-to-see" translate="GENERAL.MESSAGE.GROUP-NO-MATCHING-RESULTS"
                                         ng-show="popup.groupResults.length == 0"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- TODO PLJ 2024年3月25日18:05:43 自定义部分 -->
                    <div class="form-group clearfix"
                         ng-show="popup.assignmentObject.type == 'idm' && assignmentOption.id == 'custom'">
                        <!--  类型选择 -->
                        <div class="form-group clearfix">
                            <div class="col-xs-12">
                                <div class="col-xs-4">
                                    <label>选择类型</label>
                                </div>
                                <div class="col-xs-8">
                                    <div class="btn-group span">
                                        <select ng-model="allocationSelect" style="width: 100%;height: 34px;padding: 6px 8px;
                                         border: 1px solid #cccccc;font-size: 14px;"
                                                ng-options="x.title for x in allocationOperations"
                                                ng-change="allocationChange('1')">
                                            <option value="">-- 请选择 --</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!--  用户信息 -->
                        <div class="form-group clearfix" ng-if="allocation === 'user'">
                            <div class="col-xs-12" style="max-height:400px;overflow:auto;">
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th>NO.</th>
                                        <th>用户编号</th>
                                        <th>用户名称</th>
                                        <th>状态</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-if="tableLoading" ng-repeat="x in userTableData">
                                        <th>
                                            <input type="checkbox" ng-model="x.isChecked" ng-click="userClick(x)"/>
                                        </th>
                                        <th>{{x.user_code}}</th>
                                        <th>{{x.real_name}}</th>
                                        <th>
                                                <span class="label label-danger" ng-if="x.status===1"
                                                      style="font-size: 12px">禁用</span>
                                            <span class="label label-info" ng-if="x.status===0"
                                                  style="font-size: 12px">正常</span>
                                        </th>
                                    </tr>
                                    <tr ng-if="!tableLoading">
                                        <th colspan="4" style="text-align: center">数据加载中......</th>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <!--  部门信息 -->
                        <div class="form-group clearfix" ng-if="allocation === 'dept'">
                            <div class="col-xs-12" style="max-height:400px;overflow:auto;">
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th>NO.</th>
                                        <th>部门编号</th>
                                        <th>部门名称</th>
                                        <th>状态</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-if="tableLoading" ng-repeat="x in deptTableData">
                                        <th>
                                            <input type="checkbox" ng-model="x.isChecked" ng-click="deptClick(x)"/>
                                        </th>
                                        <th>{{x.code}}</th>
                                        <th>{{x.name}}</th>
                                        <th>
                                                <span class="label label-info" ng-if="x.status===1"
                                                      style="font-size: 12px">启用</span>
                                            <span class="label label-danger" ng-if="x.status===0"
                                                  style="font-size: 12px">禁用</span>
                                        </th>
                                    </tr>
                                    <tr ng-if="!tableLoading">
                                        <th colspan="4" style="text-align: center">数据加载中......</th>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <!--  岗位信息 -->
                        <div class="form-group clearfix" ng-if="allocation === 'post'">
                            <div class="col-xs-12" style="max-height:400px;overflow:auto;">
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th>NO.</th>
                                        <th>岗位编号</th>
                                        <th>岗位名称</th>
                                        <th>状态</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-if="tableLoading" ng-repeat="x in postTableData">
                                        <th>
                                            <input type="checkbox" ng-model="x.isChecked" ng-click="postClick(x)"/>
                                        </th>
                                        <th>{{x.code}}</th>
                                        <th>{{x.name}}</th>
                                        <th>
                                                <span class="label label-info" ng-if="x.status===1"
                                                      style="font-size: 12px">启用</span>
                                            <span class="label label-danger" ng-if="x.status===0"
                                                  style="font-size: 12px">禁用</span>
                                        </th>
                                    </tr>
                                    <tr ng-if="!tableLoading">
                                        <th colspan="4" style="text-align: center">数据加载中......</th>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <!--  岗位组信息 -->
                        <div class="form-group clearfix" ng-if="allocation === 'group'">
                            <div class="col-xs-12" style="max-height:400px;overflow:auto;">
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th>NO.</th>
                                        <th>组编号</th>
                                        <th>组名称</th>
                                        <th>状态</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-if="tableLoading" ng-repeat="x in groupTableData">
                                        <th>
                                            <input type="checkbox" ng-model="x.isChecked" ng-click="groupClick(x)"/>
                                        </th>
                                        <th>{{x.code}}</th>
                                        <th>{{x.name}}</th>
                                        <th>
                                                <span class="label label-info" ng-if="x.status===1"
                                                      style="font-size: 12px">启用</span>
                                            <span class="label label-danger" ng-if="x.status===0"
                                                  style="font-size: 12px">禁用</span>
                                        </th>
                                    </tr>
                                    <tr ng-if="!tableLoading">
                                        <th colspan="4" style="text-align: center">数据加载中......</th>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <!--  岗位等级信息 -->
                        <div class="form-group clearfix" ng-if="allocation === 'level'">
                            <div class="col-xs-12" style="max-height:400px;overflow:auto;">
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th>NO.</th>
                                        <th>等级编号</th>
                                        <th>等级名称</th>
                                        <th>级别</th>
                                        <th>状态</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-if="tableLoading" ng-repeat="x in levelTableData">
                                        <th>
                                            <input type="checkbox" ng-model="x.isChecked" ng-click="levelClick(x)"/>
                                        </th>
                                        <th>{{x.code}}</th>
                                        <th>{{x.name}}</th>
                                        <th>{{x.level}}</th>
                                        <th>
                                                <span class="label label-info" ng-if="x.status===1"
                                                      style="font-size: 12px">启用</span>
                                            <span class="label label-danger" ng-if="x.status===0"
                                                  style="font-size: 12px">禁用</span>
                                        </th>
                                    </tr>
                                    <tr ng-if="!tableLoading">
                                        <th colspan="4" style="text-align: center">数据加载中......</th>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <!--  部门-岗位信息 -->
                        <div class="form-group clearfix" ng-if="allocation === 'deptPost'">
                            <div class="col-xs-12">
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th>NO.</th>
                                        <th>部门</th>
                                        <th>岗位</th>
                                        <th>操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-repeat="(i,dp) in deptPostSelectData">
                                        <th style="line-height: 30px">
                                            {{i + 1}}
                                        </th>
                                        <th>
                                            <select id="dpDept" ng-model="deptPostSelectData[i].dept"
                                                    style="width: 100%;height: 34px;padding: 6px 8px;border: 1px solid #cccccc;font-size: 14px;"
                                                    ng-options="x as (x.code + '-' + x.name) for x in dpDeptTableData"
                                                    ng-change="dpDeptClick()">
                                                <option value="">-- 请选择 --</option>
                                            </select>
                                        </th>
                                        <th>
                                            <select id="dpPost" ng-model="deptPostSelectData[i].post"
                                                    style="width: 100%;height: 34px;padding: 6px 8px;border: 1px solid #cccccc;font-size: 14px;"
                                                    ng-options="x as (x.code + '-' + x.name) for x in dpPostTableData"
                                                    ng-change="dpPostClick()">
                                                <option value="">-- 请选择 --</option>
                                            </select>
                                        </th>
                                        <th style="width: 150px;line-height: 30px;">
                                            <button type="button" class="btn btn-primary btn-xs" ng-click="addDeptPost()">
                                                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
                                            </button>
                                            <button type="button" class="btn btn-danger btn-xs" ng-click="delDeptPost(dp)">
                                                <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>删除
                                            </button>
                                        </th>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <!-- 未选择时，默认显示 -->
                        <div class="form-group clearfix" ng-if="!allocation || allocation === '-1'">
                            <div class="col-xs-12"
                                 style="border: 1px dashed #e0e0e0;text-align: center;padding: 30px">
                                暂无数据
                            </div>
                        </div>

                    </div>


                    <div class="form-group clearfix">
                        <div class="col-xs-12">
                            <div class="col-xs-12">
                                <label>
                                    <input type="checkbox" ng-model="assignment.initiatorCanCompleteTask">
                                    &nbsp;{{'PROPERTY.ASSIGNMENT.INITIATOR-CAN-COMPLETE' | translate}}
                                </label>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            <div class="modal-footer">
                <button ng-click="close()" class="btn btn-primary" translate>ACTION.CANCEL</button>
                <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
            </div>
        </div>
    </div>
</div>